<p-dialog header="{{title}}" [(visible)]="display" modal="modal" [width]="width" [responsive]="true" (onHide)="closeAddStorageMask(false)">
  <div class="content-section  GridDemo ">

    <form class="form-horizontal storage" [formGroup]="storageForm">
        <div class="ui-grid ui-grid-responsive ui-grid-pad ui-fluid" style="margin: 10px 0px">
          <div class="ui-grid-row margin-bottom-1vw">
            <div class="ui-grid-col-2 text-right ">
              <label ><span>*</span>物品编号:</label>
            </div>
            <div [ngClass]="state!=='show'&&state!=='update'?'ui-grid-col-2':'ui-grid-col-3'">
              <input formControlName="pn"  name="pn"  type="text" pInputText   placeholder="物品编号" [(ngModel)]="submitData.pn" *ngIf="state ==='add'">
              <input formControlName="pn"  name="pn"  type="text" pInputText   placeholder="物品编号" [(ngModel)]="currentMeterial.pn" *ngIf="state ==='update'">
              <input formControlName="pn"  name="pn"  type="text" pInputText   placeholder="物品编号" [(ngModel)]="currentMeterial.pn" *ngIf="state ==='show'" readonly>
              <div class="ui-message ui-messages-error ui-corner-all"  *ngIf="!storageForm.controls['pn'].valid&&(!storageForm.controls['pn'].untouched)" >
                <i class="fa fa-close"></i>
                物品编号必填
              </div>
            </div>
            <div class="ui-grid-col-1" *ngIf="state!=='show'&& state!=='update'">
              <button pButton  type="button" (click)="showChooseMaterialNumberMask()" label="选择" ></button>
            </div>
            <div class="ui-grid-col-2 text-right">
              <label ><span>*</span>设备名称:</label>
            </div>
            <div class="ui-grid-col-3">
              <input formControlName="name"  name="name"  type="text" pInputText   placeholder="设备名称" [(ngModel)]="submitData.name" *ngIf="state ==='add'">
              <input formControlName="name"  name="name"  type="text" pInputText   placeholder="设备名称" [(ngModel)]="currentMeterial.name" *ngIf="state ==='update'" >
              <input formControlName="name"  name="name"  type="text" pInputText   placeholder="设备名称" [(ngModel)]="currentMeterial.name" *ngIf="state ==='show'"  readonly>
              <div class="ui-message ui-messages-error ui-corner-all"  *ngIf="!storageForm.controls['name'].valid&&(!storageForm.controls['name'].untouched)" >
                <i class="fa fa-close"></i>
                设备名称必填
              </div>
            </div>
          </div>
          <div class="ui-grid-row margin-bottom-1vw">
            <div class="ui-grid-col-2 text-right">
              <label ><span>*</span>物品分类:</label>
            </div>
            <div class="ui-grid-col-3">
              <!--<p-dropdown   [autoWidth]="false"></p-dropdown>-->
              <input formControlName="catagory" name="catagory"  type="text" pInputText   placeholder="物品分类" [(ngModel)]="submitData.catagory" *ngIf="state ==='add'">
              <input formControlName="catagory" name="catagory"  type="text" pInputText   placeholder="物品分类" [(ngModel)]="currentMeterial.catagory" *ngIf="state ==='update'">
              <input formControlName="catagory" name="catagory"  type="text" pInputText   placeholder="物品分类" [(ngModel)]="currentMeterial.catagory" *ngIf="state ==='show'" readonly>
              <div class="ui-message ui-messages-error ui-corner-all"  *ngIf="!storageForm.controls['catagory'].valid&&(!storageForm.controls['catagory'].untouched)" >
                <i class="fa fa-close"></i>
                物品分类必填
              </div>
            </div>
            <div class="ui-grid-col-2 text-right">
              <label ><span>*</span>供应商:</label>
            </div>

            <div class="ui-grid-col-3">
              <input formControlName="supplier" type="text" pInputText  name="supplier" placeholder="供应商"
                      class="cursor_not_allowed"  [(ngModel)]="submitData.supplier" *ngIf="state ==='add'"/>
              <input formControlName="supplier" type="text" pInputText  name="supplier" placeholder="供应商"
                      class="cursor_not_allowed"  [(ngModel)]="currentMeterial.supplier" *ngIf="state ==='update'"/>
              <input formControlName="supplier" type="text" pInputText  name="supplier" placeholder="供应商"
                      class="cursor_not_allowed"  [(ngModel)]="currentMeterial.supplier" *ngIf="state ==='show'" readonly/>
              <div class="ui-message ui-messages-error ui-corner-all"  *ngIf="!storageForm.controls['supplier'].valid&&(!storageForm.controls['supplier'].untouched)" >
                <i class="fa fa-close"></i>
                供应商必填
              </div>
            </div>
          </div>
          <div class="ui-grid-row margin-bottom-1vw">
            <div class="ui-grid-col-2 text-right">
              <label ><span>*</span>品牌:</label>
            </div>
            <div class="ui-grid-col-3">
              <input formControlName="brand" type="text" pInputText  name="brand" placeholder="品牌"
                    class="cursor_not_allowed" [(ngModel)]="submitData.brand" *ngIf="state ==='add'"/>
              <input formControlName="brand" type="text" pInputText  name="brand" placeholder="品牌"
                    class="cursor_not_allowed" [(ngModel)]="currentMeterial.brand" *ngIf="state ==='update'"/>
              <input formControlName="brand" type="text" pInputText  name="brand" placeholder="品牌"
                    class="cursor_not_allowed" [(ngModel)]="currentMeterial.brand" *ngIf="state ==='show'" readonly/>
              <div class="ui-message ui-messages-error ui-corner-all"  *ngIf="!storageForm.controls['brand'].valid&&(!storageForm.controls['brand'].untouched)" >
                <i class="fa fa-close"></i>
                品牌必填
              </div>
            </div>
            <div class="ui-grid-col-2 text-right">
              <label ><span>*</span>型号</label>
            </div>
            <div class="ui-grid-col-3">
              <input formControlName="model" type="text" pInputText  name="model" placeholder="型号"
                      class="cursor_not_allowed"  [(ngModel)]="submitData.model" *ngIf="state ==='add'"/>
              <input formControlName="model" type="text" pInputText  name="model" placeholder="型号"
                      class="cursor_not_allowed"  [(ngModel)]="currentMeterial.model" *ngIf="state ==='update'"/>
              <input formControlName="model" type="text" pInputText  name="model" placeholder="型号"
                      class="cursor_not_allowed"  [(ngModel)]="currentMeterial.model" *ngIf="state ==='show'" readonly/>
              <div class="ui-message ui-messages-error ui-corner-all"  *ngIf="!storageForm.controls['model'].valid&&(!storageForm.controls['model'].untouched)" >
                <i class="fa fa-close"></i>
                型号必填
              </div>
            </div>
          </div>
          <div class="ui-grid-row margin-bottom-1vw">
            <div class="ui-grid-col-2 text-right">
              <label ><span>*</span>规格:</label>
            </div>
            <div class="ui-grid-col-3">
              <input formControlName="specification" type="text" pInputText  name="specification" placeholder="规格"
                      class="cursor_not_allowed"  [(ngModel)]="submitData.specification" *ngIf="state ==='add'"/>
              <input formControlName="specification" type="text" pInputText  name="specification" placeholder="规格"
                      class="cursor_not_allowed"  [(ngModel)]="currentMeterial.specification" *ngIf="state ==='update'"/>
              <input formControlName="specification" type="text" pInputText  name="specification" placeholder="规格"
                      class="cursor_not_allowed"  [(ngModel)]="currentMeterial.specification" *ngIf="state ==='show'"/>
              <div class="ui-message ui-messages-error ui-corner-all"  *ngIf="!storageForm.controls['specification'].valid&&(!storageForm.controls['specification'].untouched)" >
                <i class="fa fa-close"></i>
                规格必填
              </div>
            </div>
            <div class="ui-grid-col-2 text-right">
              <label >采购时间:</label>
            </div>
            <div class="ui-grid-col-3">
              <p-calendar formControlName="time_purchase" name="begin_time" [showTime]="true"  dateFormat="yy-mm-dd" [showSeconds]="true"  readonlyInput="true"  dataType="string" [(ngModel)]="submitData.time_purchase"  [showIcon]="true" [locale]="zh" *ngIf="state ==='add'"></p-calendar>
              <p-calendar formControlName="time_purchase" name="begin_time" [showTime]="true"  dateFormat="yy-mm-dd" [showSeconds]="true"  readonlyInput="true"  dataType="string" [(ngModel)]="currentMeterial.time_purchase"  [showIcon]="true" [locale]="zh" *ngIf="state ==='update'"></p-calendar >
              <input formControlName="time_purchase" type="text" pInputText  name="specification" placeholder="采购时间"
                     class="cursor_not_allowed"  [(ngModel)]="currentMeterial.time_purchase" *ngIf="state ==='show'" readonly/>
            </div>
          </div>
          <div class="ui-grid-row margin-bottom-1vw">
            <div class="ui-grid-col-2 text-right">
              <label ><span>*</span>数量:</label>
            </div>
            <div class="ui-grid-col-3">
              <input formControlName="quantity" type="number" pInputText  name="number" placeholder="数量" [(ngModel)]="submitData.quantity"
                      class="cursor_not_allowed"  *ngIf="state ==='add'" />
              <input formControlName="quantity" type="number" pInputText  name="number" placeholder="数量" [(ngModel)]="currentMeterial.quantity"
                      class="cursor_not_allowed"  *ngIf="state ==='update'" />
              <input formControlName="quantity" type="text" pInputText  name="number" placeholder="数量" [(ngModel)]="currentMeterial.quantity"
                      class="cursor_not_allowed"  *ngIf="state ==='show'"  readonly/>
              <div class="ui-message ui-messages-error ui-corner-all"  *ngIf="!storageForm.controls['quantity'].valid&&(!storageForm.controls['quantity'].untouched)" >
                <i class="fa fa-close"></i>
                数量必填
              </div>
            </div>
            <div class="ui-grid-col-2 text-right">
              <label ><span></span>单价:</label>
            </div>
            <div class="ui-grid-col-3 text-right">
              <input formControlName="unit_cost" type="text" pInputText  name="cost" placeholder="单价" [(ngModel)]="submitData.unit_cost"
                     class="cursor_not_allowed"  *ngIf="state ==='add'" />
              <input formControlName="unit_cost" type="text" pInputText  name="cost" placeholder="单价" [(ngModel)]="currentMeterial.unit_cost"
                     class="cursor_not_allowed"  *ngIf="state ==='update'" />
              <input formControlName="unit_cost" type="text" pInputText  name="cost" placeholder="单价" [(ngModel)]="currentMeterial.unit_cost"
                     class="cursor_not_allowed"  *ngIf="state ==='show'"  readonly/>
              <div class="ui-message ui-messages-error ui-corner-all"  *ngIf="!storageForm.controls['unit_cost'].valid&&(!storageForm.controls['unit_cost'].untouched)" >
                <i class="fa fa-close"></i>
                单价必填
              </div>
            </div>

          </div>
        </div>
    </form>
  </div>
  <p-footer>
    <button type="button" pButton icon="fa-check"  label="确定" (click)="formSubmit()" *ngIf="state!=='show'" [disabled]="!storageForm.valid"></button>
    <button type="button" pButton icon="fa-close" (click)="closeAddStorageMask(false)" label="取消"></button>
  </p-footer>
</p-dialog>
<app-choose-material-number
  *ngIf="showChooseMaterialNumber"
  (closeChooseMaterialNumber)="closeChooseMaterialNumber($event)"
  (addDev)="addDev($event)"
></app-choose-material-number>
